import 'dart:ui';

import 'package:flutter/material.dart';


class PageWrapper extends StatelessWidget {
  const PageWrapper({
    super.key,
    required this.title,
    required this.child,
    this.appBarCustom,
    this.outerLRPadding = 100,
    this.outerTBPadding = 30,
  });

  final String title;
  final Widget child;
  final Widget? appBarCustom;

  final double outerLRPadding;
  final double outerTBPadding;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.transparent,
      // body: GestureDetector(
      //   onTap: () {
      //     print("tapped");
      //     Navigator.pop(context);
      //   },
      //   child: Center(
      //     child: Container(child: Text("center"), color: Colors.white,),
      //   ),
      // )
      body: BackdropFilter(
        key: const ValueKey("context"),
        filter: ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
        child: GestureDetector(
          onTap: () {
            Navigator.pop(context);
          },
          child: DefaultTextStyle(
            style: const TextStyle(
              color: Colors.white
            ),
            child: Container(
              color: Colors.transparent,
              child: Padding(
                padding: EdgeInsets.fromLTRB(outerLRPadding, outerTBPadding, outerLRPadding, outerTBPadding),
                child: GestureDetector(
                  onTap: () {},
                  child: Container(
                    decoration: BoxDecoration(
                      color: const Color.fromARGB(255, 57, 57, 57).withOpacity(0.89),
                      borderRadius: BorderRadius.circular(16)
                    ),
                    child: Padding(
                      padding: const EdgeInsets.fromLTRB(20, 10, 20, 20),
                      child: Column(
                        children: [
                          Row(
                            children: [
                              Text(
                                title,
                                style: const TextStyle(
                                  fontSize: 18
                                ),
                              ),
                              // const Expanded(child: SizedBox.shrink()),

                              appBarCustom != null
                              ? Expanded(
                                child: Padding(
                                  padding: const EdgeInsets.fromLTRB(0, 0, 10, 0),
                                  child: SizedBox(
                                    height: 30,
                                    child: appBarCustom,
                                  ),
                                ),
                              )
                              : const SizedBox.shrink(),

                              IconButton(
                                icon: const Icon(Icons.close, color: Colors.white60,),
                                onPressed: () {
                                  Navigator.pop(context);
                                },
                              )
                            ],
                          ),
                          const SizedBox(height: 16),
                          Expanded(
                            child: SizedBox(
                              width: double.infinity,
                              height: double.infinity,
                              child: child,
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}
